<template>
	<view class="content" style="background-color: #f5f5f5;">
		<u-navbar bgColor="#f5f5f5" scrollable=false titleStyle="font-size:40rpx" :placeholder='true' title="提现"
			:autoBack="true">
		</u-navbar>
		<!-- 提现 -->
		<view class="input">
			<view class="input_top li fontS28 fw6 paddingLR24">
				提现金额(元)
			</view>
			<view class="input_center li paddingLR24">
				<input v-model="money" @input='inputchange' type="text" style="height: 100%; width: 100%;font-size: 64rpx;font-weight: 500;">
			</view>
			<view class="input_bottom li fontS28 co9 paddingLR24">
				<view>当前金额19825.45,<text class="homeRed fw6">全部提现</text></view>
			</view>
		</view>
		<view class="method" @click="show = true">
			<view class="left">
				<view class="fontS28 fw6">提现至</view>
				<view class="inner">
					<image :src="value[radiovalue1-1].image" mode="" style="width: 40rpx;height: 40rpx;"></image>
					<view class="text" style="height: 40rpx;">
						<view class="fontS28 fw6">{{value[radiovalue1-1].name}}</view>
						<view class="co9 fontS24">两小时内到账</view>
					</view>
				</view>
			</view>
			<view class="right" style="line-height: 100rpx;">
				<image  src="../../../static/images/mine/right.png"
					style="height:40rpx;width:40rpx"></image>
			</view>
		</view>
		<!-- 弹出层 -->
		<view>
			<u-popup :show="show" @close="show=false"  :round='10' :closeable='true'>
				<view style="padding:8% 4% 2%;">
					<view class="top_li" style="width: 100%; text-align: right;margin-top: 40rpx;">
						<!-- <span @click="this.show=false">X</span> -->
					</view>
					<view class="u_radio" style="margin-top: 20rpx;">
						<u-radio-group v-model="radiovalue1" iconPlacement="right" placement="column"
							@change="show=false">
							<view v-for="(item, index) in value" :key=" index" style="margin-bottom: 54rpx;">
								<image :src="item.image" mode="" class="pagImage"></image>
								<u-radio :customStyle=" {marginTop: '5px',fontSize:'28rpx' }" activeColor='#DD2131' :label=" item.name"
									:name="item.type">
								</u-radio>
								<view class="co9 fontS24" style="margin:8rpx 56rpx;">
									两小时内到账
								</view>
							</view>
						</u-radio-group>
					</view>
				</view>
			</u-popup>
		</view>
		<view class="paddingLR24"> 
			<u-button :loading='loading' class="redbtn bgcred cof fontS32 "   @click="withdrawal">
				确定
			</u-button>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				loading:false,
				money:10, //提现金额
				show: false,
				value: [{
						name: '易宝支付',
						disabled: false,
						type:1,
						image:'/static/images/mine/yipay.png'
					},
					{
						name: '支付宝支付',
						disabled: false,
						type:2,
						image:'/static/images/mine/zhifubao.png'
					},
					{
						name: 'ApplePay',
						disabled: false,
						type:3,
						image:'/static/images/mine/Group 33278.png'
					}, {
						name: '微信支付',
						disabled: false,
						type:4,
						image:'/static/images/mine/weixin.png'
					}
				],
				radiovalue1:1, //当前选中的支付方式 第几个
			}
		},
		methods: {
			inputchange(e){
				if (e.detail.value.indexOf(".") < 0 && e.detail.value != "") {
					if(e.detail.value.length>8){
						e.detail.value =e.detail.value.substring(0, e.detail.value.length - 1)
					}else{
						e.detail.value = parseFloat(e.detail.value);
					}
				} else if (e.detail.value.indexOf(".") == 0) {
					    console.log('首位小数点情况')
						e.detail.value = e.detail.value.replace(/[^$#$]/g, "0.");
						e.detail.value = e.detail.value.replace(/\.{2,}/g, ".");
				}else if(!(/^(\d?)+(\.\d{0,2})?$/.test(e.detail.value))){
				          //去掉最后一位
						e.detail.value = e.detail.value.substring(0, e.detail.value.length - 1)
				}
				this.$nextTick(function(){ 
						this.money = e.detail.value
				})
			},
			// 提现申请
			withdrawal(){
				this.loading=true;
				this.$my.post('/index/user_balance/store_withdrawal',{money:this.money,type:this.value[this.radiovalue1-1].type}).then(res=>{
					this.loading=false;
					if(res.code==200){
						// this.$my.toast(res.message)
						
					}
				})
				
				
				this.$my.go('/pages/my/wallet/success?type=1')
			},
			
			
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		.pagImage{
			margin-right: 16rpx; margin-top:10rpx;float: left;width: 40rpx; height:40rpx;border-radius:50%;background-color: #d9d9d9;
		}
		.redbtn{
			margin-top: 96rpx;
		}
		.input {
			margin: 36rpx 32rpx;
			background-color: white;
			border-radius: 16rpx;
			.input_bottom{
				border-top: 1rpx solid rgba(51, 51, 51, 0.06);
			}
			.li {
				height: 90rpx;
				line-height: 95rpx;

				.homeRed {
					margin-left: 10rpx;
				}
			}

			.input_center {
				font-size: 64rpx;
			}
		}

		.method {
			display: flex;
			justify-content: space-between;
			padding: 24rpx;
			margin: 0 32rpx;
			border-radius: 16rpx;
			background-color: white;
			height: 80rpx;

			.left {
				display: flex;

				.inner {
					margin-left: 40rpx;
					display: flex;

					.text {
						margin-left: 20rpx;
					}
				}
			}

			// height: 60rpx;
			// .center {

			// 	.inner {
			// 		display: flex;
			// 	}
			// }
		}
	}
</style>
